import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/painting.dart';

/// Container是一个组合类容器，它本身不对应具体的RenderObject，它是DecoratedBox、ConstrainedBox、Transform、
/// Padding、Align等组件组合的一个多功能容器
///   this.alignment,
///   this.padding, //容器内补白，属于decoration的装饰范围
///   Color color, // 背景色
///    Decoration decoration, // 背景装饰
///   Decoration foregroundDecoration, //前景装饰
///  double width,//容器的宽度
///  double height, //容器的高度
///   BoxConstraints constraints, //容器大小的限制条件
///   this.margin,//容器外补白，不属于decoration的装饰范围
///  this.transform, //变换
///  this.child,
///
///
class ContainerWidget extends StatelessWidget {
  ContainerWidget({
    Key ?key,
    @required this.text,
  }) : super(key: key);

  final String ?text;

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: AppBar(
        title: Text(text??""),
      ),
      body: Container(
        padding: EdgeInsets.only(top: 15),
        alignment: Alignment.center,
        child: Column(
          children: <Widget>[
            Container(
              alignment: Alignment.center,
              width: 100,
              height: 30,
              color: Colors.deepOrange,
              child: Text(
                "普通的",
                style: TextStyle(color: Colors.white),
              ),
            ),
            SizedBox(
              height: 30,
            ),
            Container(
              margin: EdgeInsets.only(top: 30, left: 50),
              width: 200,
              height: 150,
              transform: Matrix4.rotationZ(0.3),
              //卡片倾斜变换
              alignment: Alignment.center,
              //卡片内文字居中
              decoration: BoxDecoration(
                  //背景径向渐变
                  gradient: RadialGradient(
                      //背景径向渐变
                      colors: [Colors.red, Colors.orange],
                      center: Alignment.topLeft,
                      radius: .98),
                  boxShadow: [
                    //卡片阴影
                    BoxShadow(
                        color: Colors.black54,
                        offset: Offset(2.0, 2.0),
                        blurRadius: 4.0)
                  ]),
              child: Text(
                //卡片文字
                "5.20", style: TextStyle(color: Colors.white, fontSize: 40.0),
              ),
            )
          ],
        ),
      ),
    );
  }
}
